import React from "react";
import Trial from "../trial";
import frame from "../../../style/frame.less";
/*
    import cloud from '../../../images/ .png'
    import bgCloud from '../../../images/办公 .png'
    import imageCloud from '../../../images/图片工作站.png'
    import aiCloud from '../../../images/人工智能 .png'
    import pCloud from '../../../images/政务 .png'
    import bCloud from '../../../images/电商 .png'
    import uCloud from '../../../images/ 联盟.png'
    import vrCloud from '../../../images/VR .png'
    import iCloud from '../../../images/行业专属 .png'
*/

import cloud from '../../../images/solution/cloud.png'
import office_cloud from '../../../images/solution/office_cloud.png'
import graphic_workstation from '../../../images/solution/graphic_workstation.png'
import ai_cloud from '../../../images/solution/ai_cloud.png'
import government_affairs_cloud from '../../../images/solution/government_affairs_cloud.png'
import E_Commerce_Cloud from '../../../images/solution/E_Commerce_Cloud.png'
import Cloud_Alliance from '../../../images/solution/Cloud_Alliance.png'
import vr_cloud from '../../../images/solution/vr_cloud.png'
import Dedicated_Cloud from '../../../images/solution/Dedicated_Cloud.png'

class Solution extends React.Component {

    constructor(props) {
        super(props);
    }

    componentDidMount() {

    }

    render() {
        return (
            <div>
                <div className={`${frame.component} ${frame.solutionContent}`}>
                    <div className={frame.solutionContentTitle}>
                        完整的解决方案
                    </div>
                    <div className={frame.solutionContentSubTitle}>
                        <p>针对不同的业务需求和应用场景，****Cloud 为你提供最专业的定制化解决方案</p>
                    </div>
                </div>

                <div className={`${frame.component} ${frame.middleContent}`}>
                    {/*<div className={frame.contentTitle}>
                        专为您设计的功能
                    </div>
                    <div className={frame.contentDivider}></div>
                    <div className={frame.contentSubTitle}>
                        我们相信我们已为您创建了最有效的 管理页面。部署、维护和都将以更便捷的方式展现给您。
                    </div>*/}
                    <div className={frame.contentSubject}>
                        <div className={frame.solution}>
                            <div>
                                <div className={frame.fade}>
                                    <div>
                                        <img src={cloud} alt="" />
                                    </div>
                                    <div className={frame.solutionTitle}>
                                         PC云<span>Cloud PC</span>
                                    </div>
                                    <div className={frame.solutionDivider}></div>
                                    <div className={frame.solutionDesc}>
                                        <label for="0">了解详情</label>
                                        <input type="checkbox" id="0" />
                                        <label for="0" className={frame.solutionDescContent}>
                                            <div>PC云</div>
                                            <div>针对个人消费者用户，我们为您提供低成本的云主机，可选按月/按流量付费模式。</div>
                                        </label>
                                    </div>
                                </div>
                            </div>
                            <div>
                                <div className={frame.fade}>
                                    <div>
                                        <img src={office_cloud} alt="" />
                                    </div>
                                    <div className={frame.solutionTitle}>
                                        办公云<span>Office Cloud</span>
                                    </div>
                                    <div className={frame.solutionDivider}></div>
                                    <div className={frame.solutionDesc}>
                                        <label htmlFor="1">了解详情</label>
                                        <input type="checkbox" id="1" />
                                        <label htmlFor="1" className={frame.solutionDescContent}>
                                            <div>办公云</div>
                                            <div>针对企业级客户，我们为您打造企业所有员工的办桌面云系统，
                                            为企业提供移动、安全、高效、易运维的专业一体化办公云系统。</div>
                                        </label>
                                    </div>
                                </div>
                            </div>
                            <div>
                                <div className={frame.fade}>
                                    <div>
                                        <img src={graphic_workstation} alt="" />
                                    </div>
                                    <div className={frame.solutionTitle}>
                                        图形工作站<span>Graphic WorkStation</span>
                                    </div>
                                    <div className={frame.solutionDivider}></div>
                                    <div className={frame.solutionDesc}>
                                        <label htmlFor="2">了解详情</label>
                                        <input type="checkbox" id="2" />
                                        <label htmlFor="2" className={frame.solutionDescContent}>
                                            <div>图形工作站</div>
                                            <div>提供了远程桌面功能和高性能GPU虚拟化技术，能实现高清桌面实时交互，
                                            提升您的GPU可视化计算服务的使用体验，为图像工作者提供高清桌面实时交互的极致体验。</div>
                                        </label>
                                    </div>
                                </div>
                            </div>
                            <div>
                                <div className={frame.fade}>
                                    <div>
                                        <img src={ai_cloud} alt="" />
                                    </div>
                                    <div className={frame.solutionTitle}>
                                        AI云<span>AI Cloud</span>
                                    </div>
                                    <div className={frame.solutionDivider}></div>
                                    <div className={frame.solutionDesc}>
                                        <label htmlFor="3">了解详情</label>
                                        <input type="checkbox" id="3" />
                                        <label htmlFor="3" className={frame.solutionDescContent}>
                                            <div>AI云</div>
                                            <div>人工智能云服务是目前主流的一种人工智能平台的服务方式，
                                            帮助客户使用平台提供的AI框架和AI基础设施来部署和运维自已专属的的机器人。</div>
                                        </label>
                                    </div>
                                </div>
                            </div>
                            <div>
                                <div className={frame.fade}>
                                    <div>
                                        <img src={government_affairs_cloud} alt="" />
                                    </div>
                                    <div className={frame.solutionTitle}>
                                        政务云<span>Government Affairs Cloud</span>
                                    </div>
                                    <div className={frame.solutionDivider}></div>
                                    <div className={frame.solutionDesc}>
                                        <label htmlFor="4">了解详情</label>
                                        <input type="checkbox" id="4" />
                                        <label htmlFor="4" className={frame.solutionDescContent}>
                                            <div>政务云</div>
                                            <div>采用桌面云安全办公方案，集成端到端安全策略，实现从终端到外设的精准管控、
                                            多种接入方式认证、传输加密、文档导出审计、个人盘加密等，全方位保护政务数据安全运行。</div>
                                        </label>
                                    </div>
                                </div>
                            </div>
                            <div>
                                <div className={frame.fade}>
                                    <div>
                                        <img src={E_Commerce_Cloud} alt="" />
                                    </div>
                                    <div className={frame.solutionTitle}>
                                        电商云<span>E-Commerce Cloud</span>
                                    </div>
                                    <div className={frame.solutionDivider}></div>
                                    <div className={frame.solutionDesc}>
                                        <label htmlFor="5">了解详情</label>
                                        <input type="checkbox" id="5" />
                                        <label htmlFor="5" className={frame.solutionDescContent}>
                                            <div>电商云</div>
                                            <div>****Cloud电商云解决方案具备高弹性、可扩展、低成本、高效率、低运维维护成本等特点，
                                            助力电商用户快速实现互联网金融创新。</div>
                                        </label>
                                    </div>
                                </div>
                            </div>
                            <div>
                                <div className={frame.fade}>
                                    <div>
                                        <img src={Cloud_Alliance} alt="" />
                                    </div>
                                    <div className={frame.solutionTitle}>
                                         云联盟<span>Cloud Alliance</span>
                                    </div>
                                    <div className={frame.solutionDivider}></div>
                                    <div className={frame.solutionDesc}>
                                        <label htmlFor="6">了解详情</label>
                                        <input type="checkbox" id="6" />
                                        <label htmlFor="6" className={frame.solutionDescContent}>
                                            <div>云联盟</div>
                                            <div>云联盟旨在建设共享云联盟平台，让参与联盟的企业将闲置的服务器计算、存储等资源分享出来，
                                            让需要云资源的用户用较低的成本使用。</div>
                                        </label>
                                    </div>
                                </div>
                            </div>
                            <div>
                                <div className={frame.fade}>
                                    <div>
                                        <img src={vr_cloud} alt="" />
                                    </div>
                                    <div className={frame.solutionTitle}>
                                        VR云<span>VR Cloud</span>
                                    </div>
                                    <div className={frame.solutionDivider}></div>
                                    <div className={frame.solutionDesc}>
                                        <label htmlFor="7">了解详情</label>
                                        <input type="checkbox" id="7" />
                                        <label htmlFor="7" className={frame.solutionDescContent}>
                                            <div>VR云</div>
                                            <div>采用高性能CPU和高性能GPU结合的方式，为VR领域提供高性能的云服务器服务，为VR视频、VR互动体验助力，
                                            提供更加快速、便捷的VR作品制作、合成、渲染的服务！</div>
                                        </label>
                                    </div>
                                </div>
                            </div>
                            <div>
                                <div className={frame.fade}>
                                    <div>
                                        <img src={Dedicated_Cloud} alt="" />
                                    </div>
                                    <div className={frame.solutionTitle}>
                                        行业专属云<span>Dedicated Cloud Solutions</span>
                                    </div>
                                    <div className={frame.solutionDivider}></div>
                                    <div className={frame.solutionDesc}>
                                        <label htmlFor="8">了解详情</label>
                                        <input type="checkbox" id="8" />
                                        <label htmlFor="8" className={frame.solutionDescContent}>
                                            <div>行业专属云</div>
                                            <div>行业专属云解决方案是面向企业、政府、金融等客户，提供计算、存储资源池以及网络、
                                            管控多级隔离的综合解决方案。</div>
                                        </label>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <Trial />
            </div>
        )
    }
}

export default Solution
